import { BrowserRouter as Router, Routes, Route, Navigate } from 'react-router-dom'
import { FluentProvider, webLightTheme } from '@fluentui/react-components'
import { useAuthStore } from './store/authStore'
import Layout from './components/Layout'
import Login from './pages/Login'
import Dashboard from './pages/Dashboard'
import Crawler from './pages/Crawler'
import Config from './pages/Config'
import Logs from './pages/Logs'

function App() {
  const isAuthenticated = useAuthStore(state => state.isAuthenticated)

  return (
    <FluentProvider theme={webLightTheme}>
      <Router>
        <Routes>
          <Route path="/login" element={<Login />} />
          <Route path="/" element={
            isAuthenticated ? <Layout /> : <Navigate to="/login" replace />
          }>
            <Route index element={<Navigate to="/dashboard" replace />} />
            <Route path="dashboard" element={<Dashboard />} />
            <Route path="crawler" element={<Crawler />} />
            <Route path="config" element={<Config />} />
            <Route path="logs" element={<Logs />} />
          </Route>
        </Routes>
      </Router>
    </FluentProvider>
  )
}

export default App
